<template>
    <h1>理财赎回</h1>

    <table class=" table table-border" border="1">
    <thead>
        <tr>
        <th><input type="checkbox"></th>
        <th>理财编号</th>
        <th>理财名称</th>
        <th>年收益</th>
        <th>月收益</th>
        <th>最低金额</th>
        <th>风险等级</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
        <tr v-for="item in Show">
            <td><input type="checkbox"></td>
            <td>{{ item.F_Id }}</td>
            <td>{{ item.F_Name }}</td>
            <td>{{ item.F_APY }}CNY</td>
            <td>{{ (item.F_MinMoney*item.F_APY/12).toFixed(2)}}CNY</td>  
            <td>{{ item.F_MinMoney }}CNY</td>
            <td>{{ item.F_Level==0?"低风险":item.F_Level==1?"中风险":"高风险" }}</td>
            <td>
                <a href="#" @click="">赎回</a>
            </td>
        </tr>
    </tbody>



</table>

</template>

<script setup lang="ts">

import { ref,onMounted } from 'vue';
import axios from 'axios';
import {useStore} from '../../store/index.ts';
//import { useRouter } from 'vue-router';

const store = useStore();

//const router = useRouter();

//用于显示的响应式数据
const Show = ref([{
    U_Id:'',
    UF_Id:'',
    F_Id:'',
    F_Name:'',
    F_APY:0,
    F_MinMoney:0,
    F_Level:0,
}])


onMounted(()=>{
    ShowData();
})

//显示 所有数据
const ShowData = ()=>{
    axios({
        url:'http://localhost:53279/api/Financing/GetUserFinanRedeemInfo',
        method:'get',
        params:{
            UId:store.UserId
        }
    })
    .then(function (res){
        console.log(res.data);
        Show.value = res.data;
    })
    .catch(function (err){
        console.log(err);  
    })
}


</script>